<extend name="public@base5"/>
<block name="main">
    <div class="wrap">
        <ul class="nav nav-tabs">
            <li class="nav-item">
                <a class="nav-link" href="{:url('Route/index')}">{:lang('ADMIN_ROUTE_INDEX')}</a>
            </li>
            <li class="nav-item">
                <a class="nav-link active" href="{:url('Route/add')}">{:lang('ADMIN_ROUTE_ADD')}</a>
            </li>
        </ul>
        <form method="post" class="js-ajax-form margin-top-20" action="admin/routes">
            <div class="row mb-3">
                <label for="input-full_url" class="col-sm-2 col-form-label text-sm-end">
                    <span class="form-required">*</span>{:lang('Full Url')}
                </label>
                <div class="col-md-8 col-sm-10">
                    <div class="input-group">
                        <input type="text" id="input-full_url" name="full_url" class="form-control">
                        <span class="input-group-btn"><a class="btn btn-primary"
                                                         href="javascript:doSelectUrl();">{:lang('Select rules')}</a></span>
                    </div>
                </div>
            </div>
            <div class="row mb-3">
                <label for="input-url" class="col-sm-2 col-form-label text-sm-end">
                    <span class="form-required">*</span>{:lang('Short Url')}
                </label>
                <div class="col-md-8 col-sm-10">
                    <input type="text" class="form-control" id="input-url" name="url">
                    <div class="form-text">{:lang('SHORT_URL_HELP_BLOCK_TEXT')}</div>
                    <div class="form-text"><span id="url-vars"></span></div>
                </div>
            </div>
            <div class="row mb-3">
                <label for="input-status" class="col-sm-2 col-form-label text-sm-end">{:lang('Status')}</label>
                <div class="col-md-8 col-sm-10">
                    <select class="form-control" name="status" id="input-status">
                        <option value="1">{:lang('Enable')}</option>
                        <option value="0">{:lang('Disable')}</option>
                    </select>
                </div>
            </div>
            <div class="row mb-3">
                <div class="offset-md-2 col-sm-10">
                    <button type="submit" class="btn btn-primary js-ajax-submit">
                        <i class="fa fa-save fa-fw"></i> {:lang('SAVE')}
                    </button>
                </div>
            </div>
        </form>
    </div>
</block>
<block name="scripts">
    <script>
        function doSelectUrl() {
            var selectedCategoriesId = $('#js-categories-id-input').val();
            parent.openIframeLayer("{:url('Route/select')}?ids=" + selectedCategoriesId, "{:lang('Please select a URL')}", {
                area: GV.IS_MOBILE ? ['100%', '100%'] : ['95%', '90%'],
                offset: GV.IS_MOBILE ? ['0px', '0px'] : 'auto',
                btn: ["{:lang('OK')}", "{:lang('CANCEL')}"],
                yes: function (index, layero) {

                    var iframeWin = parent.window[layero.find('iframe')[0]['name']];
                    var selectedUrl = iframeWin.confirm();

                    if (selectedUrl) {
                        $('#input-full_url').val(selectedUrl.action);
                        $('#input-url').val(selectedUrl.url);
                        var helpBlock = selectedUrl.vars ? "{:lang('URL parameters are xx',['vars'=>'[vars]'])}".replace('[vars]', selectedUrl.vars) : '';
                        $('#url-vars').text(helpBlock);
                    }
                    parent.layer.close(index); //如果设定了yes回调，需进行手工关闭
                }
            });
        }
    </script>
</block>
